<template>
    <ynet-content id="holidayMain" :headerInformation="true" :headerMenu="true" class="main-container">
        <div ><!--提示当前位置-->
			<ynet-breadcrumb></ynet-breadcrumb>
		</div>
        <div>
            <el-form ref="queryForm" :model="queryForm" class="formEmbedTable mt20" :rules="rules">
                <table>
                    <caption>Enquiry</caption>
                    <tr>
                        <td>Year</td>
                        <td colspan='3'>
                            <el-form-item prop="yearParam">
                                <el-input v-model="queryForm.yearParam"></el-input>
                            </el-form-item>
                        </td>
                        <td>Import</td>
                        <td colspan='3'>
                            <el-form-item prop="newFileName">
                                <ynet-upload 
                                    v-model="queryForm.newFileName"
                                    name="filePath"
                                    configName="uploadConfig"
                                    action="/api/IM0206UploadAction.do?version=1.0"
                                    ref="upload"
                                    :vm="this"
                                    @uploadSuccess="uploadSuccess"
                                    :isShowBtnUoload="uploadConfig.isShowBtnUoload"
                                ></ynet-upload>
                            </el-form-item>
                        </td>				
                    </tr>
                </table>
            </el-form>
        </div>
        <div class="btnArea mt20 tac">
            <el-button type="primary" @click="searchByYear()">Search</el-button>
            <el-button type="primary" @click="DownExcel()">DownLoad</el-button>
	    </div>
        <div class="mt30">
            <div id="cDiv" class="cDiv">
                <table id="cTable">
                    <tr>
                        <th ><a class="cBlue" @click="getPreYear(selectForm.yearParam)">Pre year</a></th>
                        <th colspan='2' style="font-size:30px;">{{selectForm.yearParam}} Year</th>
                        <th ><a class="cBlue" @click="getNextYer(selectForm.yearParam)">next year</a></th>
                        <th><a class="cBlue" @click="getPreMonth(selectForm.monthParam)">Pre Month</a></th>
                        <th  style="font-size:30px;width:14%" >
                            <el-select v-model="month" @change="monthChange()">
                                <el-option v-for="item in monthOption" :key="item.value" :label="item.label" :value="item.value" > </el-option>
                            </el-select>
                        </th>
                        <th><a class="cBlue" @click="getNextMonth(selectForm.monthParam)">Next Month</a></th>
                    </tr>
                    <tr id="cTr" class="cTr">
                        <th id="cTh" class="cTh">Sun</th>
                        <th class="cTh" >Mon</th>
                        <th class="cTh" >Tues</th>
                        <th class="cTh" >Wed</th>
                        <th class="cTh" >Thu</th>
                        <th class="cTh" >Fri</th>
                        <th class="cTh" >Sat</th>
                    </tr>
                    
                    <tr v-for="(item,itmeKey) in monthDays" :key="itmeKey" class="cTr">
                        <td v-for="(i,key) in item" class="cTd" :key="key">
                            <a v-show="i!=0" class="a" @dblclick="updateHolidayFlag(i,$event)">{{i}}</a>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
        <!--授权确认页面弹窗-->
        <div>
            <ynet-authDialog ref="dialogTable"  @getAuthForm="getAuthForm"></ynet-authDialog>
        </div>
    </ynet-content>
</template>

<script>
    //import TyphoonAdd from './components/typhoonAdd';
	export default {
		name:'holidayMain',
		components:{
          //TyphoonAdd,
		},
		data(){
            return { 
                main:true,dialogTableVisible:false,
                rules:{
                    newFileName: [
                        { trigger: 'change',validator:this.$tools.validator.fileValidator,fileType:['xlsx','xls'],vm:this,configName:"uploadConfig"},
                    ],
                    //yearParam:[{trigger:blur,validator:this.$tools.validator.isInteger}]
                },
                needAuth:'',
                authType:'', 
                editData:{},
                authForm: { authUserNo: '', password: '',randomField:''},//100004   617100
                queryForm:{
                    yearParam:'',paramCode:'',bsnCode:'IM0206',
                    newFileName:'',
                },
                selectForm:{
                    yearParam:'',monthParam:'',paramFlag:'',dayParam:'',
                },
                uploadConfig:{
                    isUploading:false,
                    isClickUpload:false,
                    isShowBtnUoload:true,
                    isSuccess:false,
                    fileSize:5
                },
                monthDays:[],//选择的月数
                addForm:{
                    yearParam:'',monthParam:'',paramFlag:'',dayParam:'',bsnCode:'IM0206',userNo:"",actionType:'1',
                    addHolidayList:[{yearParam:'',monthParam:'',paramFlag:'',dayParam:'',}],
                    delHolidayList:[{yearParam:'',monthParam:'',paramFlag:'',dayParam:'',}],
                },
                holiday:[],//从后台查回来的当年下所有的节假日与非节假日
                isHolidayData:[],//处理后的当年下的所有节假日
                noHolidayData:[],//处理后的当年下的所有节假日
                monthOption:[
                    {label:"January" ,value:'0'},{label:"February" ,value:'1'},{label:"March" ,value:'2'},{label:"April" ,value:'3'},{label:"May" ,value:'4'},{label:"June" ,value:'5'},
                    {label:"July" ,value:'6'},{label:"August" ,value:'7'},{label:"September" ,value:'8'},{label:"October" ,value:'9'},{label:"November" ,value:'10'},{label:"December" ,value:'11'},
                ],
                month:'',
            }   
        },
        mounted(){
            //默认加载本月
            let date=new Date;
            let year=date.getFullYear(); 
            let month=date.getMonth();
            this.selectForm.yearParam=year;
            this.selectForm.monthParam=month;
            this.queryForm.yearParam=year;
            this.month=month+"";
            this.queryChange();
            //this.getCurrentMonth();
            this.addForm.userNo=this.$tools.storage.get("user","save").userNo
        },
		methods:{
            searchByYear(){
                console.log("queryForm:"+JSON.stringify(this.queryForm))
                if(this.selectForm.yearParam<1970){
                    this.queryForm.yearParam=1970;
                }
                this.selectForm.yearParam=Number(this.queryForm.yearParam)
                $(".dSpan").prev().css({"color":"#030303"})
                $(".dSpan").remove();
                this.queryChange();
            },
            monthChange(){
                //console.log(this.month)
                this.selectForm.monthParam=Number(this.month)
                $(".dSpan").prev().css({"color":"#030303"})
                $(".dSpan").remove();
                this.$tools.request(this,"IM0206QueryAction.do",this.queryForm).then(data=>{
                    //console.log("monthChange_data:"+JSON.stringify(data))
                    if(data.body.errorCode==0){
                            this.holiday=data.body.holidayList;
                    }else{
                        this.$alert(data.body.errorMsg, "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })
                this.getCurrentMonth()
            },
            getCurrentMonth(){//获取当月所有天数
                var Calendar = require('../../../node_modules/calendar').Calendar
                var cal = new Calendar()
                this.monthDays=[]
                let monthDaysTemp=cal.monthDays(this.selectForm.yearParam,this.selectForm.monthParam); 
                this.monthDays=$.extend(this.monthDays,monthDaysTemp); 
                //设置之前需要将之前设置的清除掉
                //$(".cSpan").prev().css({"color":"#ee6b00"})
                let _this=this
                //_this.setHolidayFlag()
                setTimeout(function(){//延时，否则第六行样式加不上去
                   _this.setHolidayFlag()
                },100)
                
            },
            setHolidayFlag(){//设置节假日标识
                this.isHolidayData=[];
                this.noHolidayData=[];
                let holidayData=[];
                let isHoliday=[];
                let noHoliday=[];
                let selectData={}
                selectData=$.extend(selectData,this.selectForm)
                if(selectData.monthParam<9){
                    selectData.monthParam=selectData.monthParam+1;
                    selectData.monthParam="0"+selectData.monthParam;
                }else{
                    selectData.monthParam=selectData.monthParam+1;
                }
                holidayData=$.extend(holidayData,this.holiday);
                $.each(holidayData,function(i,m){
                    if(m.yearParam==selectData.yearParam){
                        $.each(m.childrens,function(j,n){
                            if(n.monthParam==selectData.monthParam){
                                 $.each(n.childrens,function(k,p){
                                    if(p.dayParam.indexOf(0)==0){
                                        p.dayParam=(p.dayParam).substr(1,1)
                                    }
                                    if(p.paramFlag==0){//节假日
                                        isHoliday.push(p.dayParam)
                                    }else{
                                        noHoliday.push(p.dayParam)
                                    }
                                 })
                            }
                        })
                    }
                })
                //console.log("isHoliday"+JSON.stringify(isHoliday))
                //console.log("noHoliday"+JSON.stringify(noHoliday))
                let monthDayData=[];
                monthDayData=$.extend(monthDayData,this.monthDays);
                //console.log("length:"+monthDayData.length)
                $.each(monthDayData,function(i,m){
                    $.each(m,function(j,n){
                        let crNode=$("table#cTable tr:nth-of-type("+(3+i)+") td:nth-of-type("+(j+1)+")");
                        if(j==0 && monthDayData[i][0]!=0){
                            if( ($.inArray(monthDayData[i][0]+"",noHoliday)) != -1){//存在,表名周末不是节假日
                                //console.log("monthDayData["+i+"][0]:"+monthDayData[i][0])
                                $("crNode:last-child").remove();
                            }else{
                                //console.log("else["+i+"][0]:"+monthDayData[i][0])
                                if($(crNode.is(':has(".dSpan")'))){
                                    //console.log("has")
                                    //$("crNode:last-child").remove();
                                    $("crNode").children(".dSpan").remove();
                                }
                                //$("crNode:last-child").remove();
                                $(crNode).append("<span class='dSpan' >休</span>")
                                 //$(crNode).children(".a").css({"color":"#ee6b00"})//ee6b00
                                 $(".dSpan").prev().css({"color":"#ee6b00"})
                            }
                        }else{
                            
                            if($.inArray(monthDayData[i][j]+"",isHoliday) !=-1){
                                //console.log("else["+i+"]["+j+"]:"+monthDayData[i][j])
                                if($(crNode.is(':has(".dSpan")'))){
                                    //console.log(123)
                                    $("crNode").children(".dSpan").remove();
                                }
                                $("crNode:last-child").remove();
                                $(crNode).append("<span class='dSpan' >休</span>")
                                 $(".dSpan").prev().css({"color":"#ee6b00"})
                            }
                        }
                    })
                })
                // if(monthDayData.length>5){
                //     console.log(5)
                // }
                // setTimeout(function(){
                //     console.log(5)
                // },0)
                
            },
            updateHolidayFlag(val,event){//鼠标双击改变节假日状态
                console.log("val:"+val)
                this.selectForm.dayParam=val;
                let ele = event.currentTarget;
                let parentEle=$(ele).parent();
                console.log("selectForm:"+JSON.stringify(this.selectForm))
                //判断是否小于当前日期,小于当前日期不能设置
                //获取系统时间
                let date=new Date;
                //获取设置的日期毫秒数
                let setTime=(new Date(this.selectForm.yearParam,this.selectForm.monthParam,this.selectForm.dayParam)).getTime();
                //设置系统日期
                let year=date.getFullYear();
                let month1=date.getMonth();
                let day1=date.getDate()
                console.log(year+":"+month1+":"+day1)

                let sysTime=(new Date(date.getFullYear(),date.getMonth(),date.getDate())).getTime();
                if(sysTime>=setTime){
                    this.$alert("current time >setting time",{
                        confirmButtonText:'Confirm'
                    })
                }else{
                    if($(ele).parent().is(':has("span")')){
                        $(ele).css({color:"#030303"})//030303
                        $(ele).next().remove()
                        this.selectForm.paramFlag=1;//取消节假日标识
                    }else{
                        $(parentEle).append("<span class='dSpan' >休</span>")
                        this.selectForm.paramFlag=0;//增加节假日标识
                    }
                    $(".dSpan").prev().css({"color":"#ee6b00"})
                    this.holiAdd();
                }
                
            }, 
            //上一年
            getPreYear(){
                this.selectForm.yearParam-=1;
                if(this.selectForm.yearParam<1970){
                    this.selectForm.yearParam=1970;
                }
                //console.log("yearParam:"+this.selectForm.yearParam)
                this.queryForm.yearParam=this.selectForm.yearParam;
                
                $(".dSpan").prev().css({"color":"#030303"})
                $(".dSpan").remove();
                this.queryChange();
            },
            getNextYer(){
                this.selectForm.yearParam+=1;
                //console.log("yearParam:"+this.selectForm.yearParam)
                this.queryForm.yearParam=this.selectForm.yearParam;

                //this.queryChange();
                //this.getCurrentMonth()

                $(".dSpan").prev().css({"color":"#030303"})
                $(".dSpan").remove();
                //this.setHolidayFlag()
                this.queryChange();
            },
            getPreMonth(){
                this.selectForm.monthParam-=1;
                if(this.selectForm.monthParam<0){
                    this.selectForm.yearParam-=1;
                    this.selectForm.monthParam=11;
                    if(this.selectForm.yearParam<1970){
                        this.selectForm.yearParam=1970;
                    }
                }
                this.month=this.selectForm.monthParam+"";
                //先清除上个月的样式和休 标识
                $(".dSpan").prev().css({"color":"#030303"})
                $(".dSpan").remove();
                this.queryChange();
            },
            getNextMonth(){
                this.selectForm.monthParam+=1;
                if(this.selectForm.monthParam>11){
                    this.selectForm.monthParam=0;
                    this.selectForm.yearParam+=1;
                }
                this.month=this.selectForm.monthParam+"";
                //console.log("monthParam:"+this.selectForm.monthParam)
                $(".dSpan").prev().css({"color":"#030303"})
                $(".dSpan").remove();
                this.queryChange();
            }, 
            uploadSuccess(input){
                //console.log("input:"+input)
                let requestData={}
                requestData.newFileName=input.body.newFileName
                this.uploadConfig.isSuccess=true;
                this.$tools.request(this,"IM0206StatusAction.do",requestData).then(data=>{

                })
            },
            resetForm(formName){
                this.$refs[formName].resetFields();
            },
            getAuthForm(val){
                //获取授权数据
                this.authForm=val;
                //console.log("val:"+JSON.stringify(val))
                this.addForm=$.extend(this.addForm,this.authForm)
                  //自己页面提交给后台的.do方法
                this.holiAdd();
            },
            queryAuth(val,event){//查询授权模式
                //this.saveStt.val=val;
                //this.saveStt.event=event;
                //console.log("saveStt:"+JSON.stringify(this.saveStt))
                let body={};body.bsnCode="IM0206";body.version="IM0206",
                this.$tools.request(this,"IM010001Action.do",body).then(data=>{
                    if(data.body.errorCode==0){
                        if(data.body.needAuth==0){//无需授权
                            this.updateHolidayFlag(val,event)
                        }else if(data.body.needAuth==1 && data.body.authType==1){
                            this.needAuth=1;
                            this.authType=1;
                            this.selectForm.dayParam=val;
                            let ele = event.currentTarget;
                            let parentEle=$(ele).parent();
                            //console.log("parentEle:"+JSON.stringify(parentEle))
                            //判断是否小于当前日期,小于当前日期不能设置
                            //获取系统时间
                            let date=new Date;
                            //获取设置的日期毫秒数
                            let setTime=(new Date(this.selectForm.yearParam,this.selectForm.monthParam,this.selectForm.dayParam)).getTime();
                            //设置系统日期
                            let sysTime=(new Date(date.getFullYear(),date.getMonth(),date.getDate())).getTime();
                            if(sysTime>=setTime){
                                this.$alert("setting time < current time",{
                                    confirmButtonText:'Confirm'
                                })
                            }else{
                                if($(ele).parent().is(':has("span")')){
                                    $(ele).css({color:"#030303"})//030303
                                    $(ele).next().remove()
                                    this.selectForm.paramFlag=1;//取消节假日标识
                                }else{
                                    $(parentEle).append("<span class='dSpan' >休</span>")
                                    this.selectForm.paramFlag=0;//增加节假日标识
                                }
                                $(".dSpan").prev().css({"color":"#ee6b00"})
                                this.$refs["dialogTable"].show()
                            }
                            
                            
                        }else if( data.body.needAuth==1 && data.body.authType==2 ){
                            this.needAuth=1;
                            this.authType=2;
                            this.selectForm.dayParam=val;
                            let ele = event.currentTarget;
                            let parentEle=$(ele).parent();
                            //console.log("selectForm:"+JSON.stringify(this.selectForm))
                            //判断是否小于当前日期,小于当前日期不能设置
                            //获取系统时间
                            let date=new Date;
                            //获取设置的日期毫秒数
                            let setTime=(new Date(this.selectForm.yearParam,this.selectForm.monthParam,this.selectForm.dayParam)).getTime();
                            //设置系统日期
                            let sysTime=(new Date(date.getFullYear(),date.getMonth(),date.getDate())).getTime();
                            if(sysTime>=setTime){
                                this.$alert("setting time < current time",{
                                    confirmButtonText:'Confirm'
                                })
                            }else{
                                if($(ele).parent().is(':has("span")')){
                                    this.selectForm.paramFlag=1;//取消节假日标识
                                }else{
                                    this.selectForm.paramFlag=0;//增加节假日标识
                                }
                                this.holiAdd();
                            }
                        }else{
                            this.$alert('Authorization Type Error', {
                                confirmButtonText: 'Confirm',
                                callback: action => {
                                }
                            });
                        }
                    }else{
                        this.$alert(data.body.errorMsg, "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        });
                    }
                })   
                    
            },
            holiAdd(){//双击后向数据库新增或修改数据
                console.log("holiAdd"+JSON.stringify(this.selectForm))
                if(this.selectForm.paramFlag==0){//是节假日
                    this.addForm.yearParam=this.selectForm.yearParam
                    this.addForm.paramFlag=this.selectForm.paramFlag
                    //判断月份是否小于10
                    if((this.selectForm.monthParam+1)<10){
                        this.addForm.monthParam="0"+(this.selectForm.monthParam+1);
                    }else{
                        this.addForm.monthParam=(this.selectForm.monthParam+1); 
                    }
                    //判断日期是否小于10
                    if(this.selectForm.dayParam<10){
                        this.addForm.dayParam="0"+(this.selectForm.dayParam);
                    }else{
                        this.addForm.dayParam=this.selectForm.dayParam; 
                    }
                }else{//不是节假日
                    this.addForm.yearParam=this.selectForm.yearParam
                    this.addForm.paramFlag=this.selectForm.paramFlag
                    //判断月份是否小于10
                    if((this.selectForm.monthParam+1)<10){
                        this.addForm.monthParam="0"+(this.selectForm.monthParam+1);
                    }else{
                        this.addForm.monthParam=(this.selectForm.monthParam+1); 
                    }
                    //判断日期是否小于10
                    if(this.selectForm.dayParam<10){
                        this.addForm.dayParam="0"+(this.selectForm.dayParam);
                    }else{
                        this.addForm.dayParam=this.selectForm.dayParam; 
                    }
                }
                console.log("addForm:"+JSON.stringify(this.addForm))
                this.$tools.request(this,"IM0206Action.do",this.addForm).then(data=>{
                    if(data.body.errorCode==0){
                        if(this.needAuth==1 && this.authType==2){
                            this.$message({
                                type:'success',
                                message:'Waiting for Authorized'
                            })
                        }else if(this.needAuth==1 && this.authType==1){
                            if(data.body.authStatus==1){
                                this.$message({
                                    type:'warning',
                                    message:'Authorship No. or password wrong ,please resume load',
                                    showClose:true,
                                })
                            }else{
                                this.$message({
                                    type:'success',
                                    message:'Success',
                                    showClose:true,
                                })
                            }
                        }else{
                            this.$message.success({
                                message:'Success',
                                showClose:true,
                            })
                        }
                        
                    }else{
                        this.$alert(data.body.errorMsg,{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })
                
            },
            queryChange(){
                //console.log("queryForm:"+JSON.stringify(this.queryForm))
                this.$tools.request(this,"IM0206QueryAction.do",this.queryForm).then(data=>{
                    //console.log("data:"+JSON.stringify(data))
                    if(data.body.errorCode==0){
                            this.holiday=data.body.holidayList;
                            //console.log(this.holiday.length)
                            this.getCurrentMonth();
                    }else{
                        this.$alert(data.body.errorMsg, "warning",{
                            confirmButtonText: 'Confirm',
                            callback: action => {
                            }
                        })
                    }
                })
            },
            DownExcel(){
                let body=[]
                let url="/api/IM0206DownAction.do";
                let form = $("<form></form>").attr("action", url).attr("method", "post")
                form.append($("<input></input>").attr("type", "hidden").attr("name", "bsnCode").attr("value", "IM0206"))
                form.append($("<input></input>").attr("type", "hidden").attr("name", "versionNo").attr("value", "1.0"))
                form.append($("<input></input>").attr("type", "hidden").attr("name", "iCIFID").attr("value", this.$tools.storage.get("user",'save').iCIFID))
                form.appendTo("body").submit().remove();
            },
            
		}
	}
</script>
<style>
    /* table */
    #cTable{
        width: 80%;
        border:2px solid #ee6b00;
        margin:0 auto;
    }
    /* 行    */
    .cTr{
        border:1px solid #ee6b00 ;
    }
    #cTr{
        background:#C7C7C7;
    }
    /* 内容 单元格 */
    .cTd{
        border:1px solid #ee6b00;
        text-align: center;
        font-family: Times New Roman;
        font-size: 40px;
    }
    /* 表头行 单元格 #ee6b00*/
    .cTh{
        border:1px solid #ee6b00;
        font-size: 30px;
    }
    #cTh{
        color: #ee6b00;
    }
    /*
    #cTh{
        color: #ee6b00;
    }

    */
    /* div样式 */
    .cDiv{
        margin:0 auto;
        width:80%;
    }
    .dSpan{
        color: #df0937;
        font-size: 10px;
    }
    .a{
        /* 黑色*/
        color: #030303;
    }
    .sun{
        color: #030303;
    }
</style>
